import router from '@/router'
// 引入vuex的
import store from '@/store'
import NProgress from 'nprogress' // 引入一份进度条插件
import 'nprogress/nprogress.css' // 引入进度条样式
// 定义白名单  所有不受权限控制的页面
const whiteList = ['/login', '/404']
// 路由前置守卫
router.beforeEach(async (to, from, next) => {
  // 打开进度条
  NProgress.start()
  // 如果有token
  if (store.getters.token) {
    // 判断是不是去登录页
    if (to.path == '/login') {
      // 有token去登录页那么跳转到主页
      next('/')
    } else {
      //放行前获取用户信息 如果没有用户id说明没有用户信息那么就获取用户资料
      if (!store.getters.userId) {
        //异步函数 必须等待这个执行完才能进行下面的放行
        //roles.menus里面有该用户拥有的路由权限
        const { roles } = await store.dispatch('user/getUserInfo')
        //调用vuex里面筛选路由表的方法   filterRoutes里面return了routes得到的数据 这边可以接收
        const routes = await store.dispatch('permission/filterRoutes', roles.menus)
        console.log(routes)


        // 404 page must be placed at the end !!!   404页面必须放到最后
        router.addRoutes([...routes, { path: '*', redirect: '/404', hidden: true }])
        //next(to.path)相当于添加动态路由路还没铺好,出去再重新进来路就铺好了
        next(to.path)
      } else {
        // 有token不是去登录页就放行
        next()
      }

    }
  } else {
    // 没有token判断是不是去往白名单页面
    if (whiteList.indexOf(to.path) > -1) {
      next()
    } else {
      // 没有在白名单里面跳转到登录页
      next('/login')
    }
  }
  // 关闭进度条
  NProgress.done()
})
// 路由后置守卫
router.afterEach(() => {
  // 关闭进度条
  NProgress.done()
})
